import cityList from 'service/config/picker/city.js'
import verifys from 'service/util/verifys.js'
import { mapGetters, mapState } from 'vuex'

var cache = {
    clientName: '',
    cityList,
    bankList: null,
    // 卡号
    bankCard: '',
    // 银行编码
    bankCode: null,
    // 银行名称
    bankName: null,
    // 银行预留手机号
    bankMobile: '',
    // 省份code
    provinceCode: null,
    // 省份名称
    provinceName: null,
    // 市级code
    cityCode: null,
    // 市级名称
    cityName: null,
    // 已认证的信息
    cardInfo: null
}

export default {
    data() {
        cache.provinceCode = null
        cache.provinceName = null
        cache.cityCode = null
        cache.cityName = null
        return cache
    },
    computed: {
        ...mapState(['user']),
        ...mapGetters(['userBankcardStatus'])
    },
    mounted() {
        // 如果已经认证过，则显示内容，但不允许再次认证
        $loading.show()
        if (this.userBankcardStatus) {
            $ajax.bank.cardInfo({
                userId: this.user.userId
            }).then(res => {
                var { code, msg, data } = res.data
                if (code == 'S') {
                    $loading.hide()
                    this.cardInfo = data
                } else {
                    $toast.show(msg)
                }
            }).catch(err => {
                $loading.hide()
                $router.replace('/system/neterror')
            })
        } else {
            $ajax.bank.all({
                userId: this.user.userId
            }).then(res => {
                var { code, data } = res.data
                if (code == 'S') {
                    this.bankList = [data.list]
                }
                $loading.hide()
            }).catch(err => {
                $loading.hide()
                $router.replace('/system/neterror')
            })
        }
    },
    beforeDestroy() {
        this.$refs.bankPicker.hide()
        this.$refs.cityPicker.hide()
    },
    methods: {
        submit() {
            var { bankCode, bankName, bankCard, bankMobile, provinceCode, provinceName, cityCode, cityName } = this
            if (!bankCode || !bankName) {
                $toast.show('请选择银行名称')
            } else if (!verifys.verify(['bankCard'], this)) {
                // 验证不通过，不做操作
            } else if (provinceCode === null || provinceName === null || cityCode === null || cityName === null) {
                $toast.show('请选择开户省市')
            } else if (!verifys.verify(['bankMobile'], this)) {
                // 验证不通过，不做操作
            } else {
                $loading.show()
                $ajax.bank.bind({
                    userId: this.user.userId,
                    bankCode,
                    bankName,
                    bankCard,
                    bankMobile,
                    provinceCode,
                    provinceName,
                    cityCode,
                    cityName
                }).then(res => {
                    var { code, msg } = res.data
                    $toast.show(msg)
                    if (code == 'S') {
                        this.$refs.signForm.submit()
                    }
                }).catch(err => {
                    $toast.show('网络异常，请稍后重试')
                })
            }
        },
        // 选择银行名称
        selectBank(values, text) {
            this.bankCode = values[0]
            this.bankName = text
        },
        // 选择开户地址
        selectPlace(values, text) {
            this.provinceCode = values[0]
            this.cityCode = values[1]
            var placeNames = text.split(' ')
            this.provinceName = placeNames[0]
            this.cityName = placeNames[1]
        }
    },
    mixins: [$mixins.needLogin]
}
